import type { Metadata } from 'next';
import Link from 'next/link';
import { notFound } from 'next/navigation';
import { Donut, HBars, StackedBars } from '@/components/charts/charts';
import { Block, EventsList, ExternalLink, HeroFacts, KpiStrip, PlannedUnavailable, Tag, entityMetadata } from '@/components/entities/shared';
import { ConstellationsMiniTable, LaunchesTable, SatellitesTable, SitesTable } from '@/components/entities/tables';
import { Container } from '@/components/ui/section';
import { Unavailable } from '@/components/ui/unavailable';
import { ApiError, api } from '@/lib/api';
import { fmtDate, fmtDateTime, fmtInt, num, titleCase } from '@/lib/format';
import { MISSION_LABELS, ORBIT_CLASS_COLORS, SITE_URL, STATUS_COLORS, routes } from '@/lib/site';
import type { OperatorDetail } from '@/lib/types';

type Props = { params: Promise<{ slug: string }> };

async function load(slug: string): Promise<{ d: OperatorDetail; generatedAt: string } | null> {
  try {
    const res = await api.operator(slug);
    return { d: res.data, generatedAt: res.meta.generated_at };
  } catch (e) {
    if (e instanceof ApiError && e.notFound) return null;
    throw e;
  }
}

export async function generateMetadata({ params }: Props): Promise<Metadata> {
  const { slug } = await params;
  const r = await load(slug).catch(() => null);
  if (!r) return { title: 'Operator not found', robots: { index: false } };
  const { d } = r;
  return entityMetadata({
    title: `${d.name} — ${fmtInt(d.active_payloads)} active satellites, ${titleCase(d.kind).toLowerCase()}${d.country_name ? ` (${d.country_name})` : ''}`,
    description: `${d.name} operates ${fmtInt(d.active_payloads)} active payloads out of ${fmtInt(d.total_payloads)} launched across ${fmtInt(d.launches)} launches since ${fmtDate(d.first_launch)}. Fleet by status, orbit and mission, constellations, launch history and growth.`,
    path: routes.operator(d.slug),
  });
}

export default async function OperatorPage({ params }: Props) {
  const { slug } = await params;
  const r = await load(slug);
  if (!r) notFound();
  const { d, generatedAt } = r;

  const statusData = d.status_distribution.map((s) => ({ label: titleCase(s.status.toLowerCase()), value: num(s.count) ?? 0, color: STATUS_COLORS[s.status] ?? 'var(--other)' })).filter((x) => x.value > 0).sort((a, b) => b.value - a.value);
  const orbitData = d.orbit_distribution.map((o) => ({ label: o.orbit_class, value: num(o.count) ?? 0, color: ORBIT_CLASS_COLORS[o.orbit_class] ?? 'var(--other)' })).filter((x) => x.value > 0).sort((a, b) => b.value - a.value);
  const missionData = d.mission_distribution.map((m) => ({ label: MISSION_LABELS[m.mission_type] ?? titleCase(m.mission_type), value: num(m.count) ?? 0 })).filter((x) => x.value > 0).sort((a, b) => b.value - a.value);
  const growth = d.growth.map((g) => {
    const launched = num(g.launched) ?? 0;
    const still = Math.min(launched, num(g.still_active) ?? 0);
    return { x: g.year, still_active: still, retired: Math.max(0, launched - still) };
  });

  const jsonLd = {
    '@context': 'https://schema.org',
    '@type': 'Organization',
    name: d.name,
    alternateName: d.aliases,
    url: d.official_url ?? undefined,
    sameAs: d.official_url ? [d.official_url] : undefined,
    address: d.country_name ? { '@type': 'PostalAddress', addressCountry: d.country_code ?? d.country_name } : undefined,
    mainEntityOfPage: `${SITE_URL}${routes.operator(d.slug)}`,
  };

  return (
    <Container wide>
      <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }} />

      <header className="pb-6 pt-8 md:pb-8 md:pt-12">
        <nav aria-label="Breadcrumb" className="eyebrow">
          <Link href={routes.operators()} className="hover:text-ink">Operators</Link> <span aria-hidden>/</span> {d.name}
        </nav>
        <div className="mt-3 flex flex-wrap items-center gap-2">
          <Tag tone="accent">{titleCase(d.kind)}</Tag>
          {d.country_code && <Tag>{d.country_code}</Tag>}
        </div>
        <h1 className="display mt-3 text-3xl md:text-5xl">{d.name}</h1>
        <p className="mt-3 max-w-2xl text-[15px] text-ink-2 md:text-base">
          {d.country_slug ? <Link href={routes.country(d.country_slug)} className="link">{d.country_name}</Link> : 'Country unavailable'}
          {' '}· {fmtInt(d.active_payloads)} active payloads · {fmtInt(d.constellations)} {num(d.constellations) === 1 ? 'constellation' : 'constellations'}
        </p>
        {d.description && <p className="mt-4 max-w-3xl text-[15px] leading-relaxed text-ink-2">{d.description}</p>}
        <HeroFacts
          items={[
            { label: 'Official site', value: d.official_url ? <ExternalLink href={d.official_url} /> : null },
            { label: 'Also known as', value: d.aliases.length ? d.aliases.join(' · ') : null },
          ]}
        />
      </header>

      <KpiStrip
        items={[
          { label: 'Active payloads', value: <span className="text-active">{fmtInt(d.active_payloads)}</span> },
          { label: 'On orbit', value: fmtInt(d.on_orbit_payloads) },
          { label: 'Total payloads', value: fmtInt(d.total_payloads) },
          { label: 'Decayed', value: fmtInt(d.decayed) },
          { label: 'Launches', value: fmtInt(d.launches) },
          { label: 'Launched 365 d', value: fmtInt(d.payloads_last_365d) },
          { label: 'Constellations', value: fmtInt(d.constellations) },
          { label: 'First launch', value: <span className="text-xl md:text-2xl">{fmtDate(d.first_launch)}</span> },
          { label: 'Last launch', value: <span className="text-xl md:text-2xl">{fmtDate(d.last_launch)}</span> },
          { label: 'Snapshot', value: <span className="text-base text-ink-2 md:text-lg">{fmtDateTime(generatedAt)}</span> },
        ]}
      />

      <div className="grid gap-x-10 lg:grid-cols-[minmax(0,7fr)_minmax(0,4fr)]">
        <div className="min-w-0">
          <Block eyebrow="Growth" title="Fleet growth by launch year" id="growth">
            {growth.length ? (
              <StackedBars data={growth} keys={['still_active', 'retired']} labels={{ still_active: 'Launched · still active', retired: 'Launched · no longer active' }} title="Payloads launched per year, split by current status" height={200} />
            ) : (
              <Unavailable what="Fleet growth" />
            )}
          </Block>
          <Block eyebrow="Programmes" title={`Constellations · ${fmtInt(d.constellations)}`} id="constellations">
            <ConstellationsMiniTable rows={d.constellations_list} />
          </Block>
          <Block eyebrow="Launches" title={`Launch history · ${fmtInt(d.launches)} launches`} id="launches">
            <LaunchesTable rows={d.launches_list} />
            {d.launches_list.length < (num(d.launches) ?? 0) && <p className="mt-2 text-xs text-ink-3">Showing the {fmtInt(d.launches_list.length)} most recent launches.</p>}
          </Block>
          <Block eyebrow="Fleet" title="Fleet sample" id="fleet" action={{ href: routes.satellites(`operator=${encodeURIComponent(d.slug)}`), label: 'All satellites operated' }}>
            <SatellitesTable rows={d.fleet_sample} columns={['orbit', 'mission', 'perigee']} />
          </Block>
          <Block eyebrow="Timeline" title="Events" id="events" action={{ href: routes.events(`entity=${encodeURIComponent(d.id)}`), label: 'All events' }}>
            <EventsList events={d.events} />
          </Block>
        </div>

        <aside className="min-w-0 lg:border-l lg:border-rule lg:pl-10">
          <Block eyebrow="Fleet" title="By status">
            <Donut data={statusData} title="Payloads by status" total={num(d.total_payloads) ?? undefined} size={140} />
          </Block>
          <Block eyebrow="Fleet" title={<span className="inline-flex items-center gap-2">By orbit class <Link href={routes.methodology()} className="text-[10px] font-semibold uppercase tracking-[0.12em] text-accent-2 hover:underline">derived</Link></span>}>
            <Donut data={orbitData} title="Payloads on orbit by orbit class" size={140} />
          </Block>
          <Block eyebrow="Fleet" title={<span className="inline-flex items-center gap-2">By mission <Link href={routes.methodology()} className="text-[10px] font-semibold uppercase tracking-[0.12em] text-accent-2 hover:underline">derived</Link></span>}>
            <HBars data={missionData} />
          </Block>
          <Block eyebrow="Ground" title="Launch sites">
            <SitesTable rows={d.launch_sites} />
          </Block>
          <Block eyebrow="Monitoring" title="Recent announcements">
            <PlannedUnavailable what="Recent announcements" note="Company monitoring (press releases, filings, official channels) is planned. Nothing is shown until a source is connected." />
          </Block>
        </aside>
      </div>
    </Container>
  );
}